<!--
 * @Date: 2024-11-18 16:38:58
 * @Author: LiSong
 * @LastEditors: LiSong
 * @LastEditTime: 2024-11-19 13:57:35
 * @Description: 图标下拉选择
-->
<template>
  <LayoutFull
    :enableAside="false"
    :enableHeader="false"
  >
    <template #main>
      <el-form class="form-wrapper" :label-width="150">
        <el-row :gutter="20">
          <el-col :span="6">
            <el-form-item label="菜单图标">
              <IconSelector v-model="iconState.iconClass"/>
            </el-form-item>
            <el-form-item label="菜单图标（选中的值）">
              <el-input v-model="iconState.iconClass" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </template>
  </LayoutFull>
</template>

<script setup>
import { reactive } from 'vue';
import { IconSelector } from '@/components/rk-icon'


const iconState = reactive({
  iconText: ''
})

</script>

<style lang="scss" scoped>
.form-wrapper {
  width: 100%;
  padding-top: 20px;
}
</style>
